<!DOCTYPE html>
<html>
<head>
	<link rel="shortcut icon" href="__STATIC__/layout/favicon.ico">
<link href="__STATIC__/layout/css/bootstrap.min.css?v=3.3.6" rel="stylesheet">
<link href="__STATIC__/layout/css/font-awesome.min.css?v=4.4.0" rel="stylesheet">
<link href="__STATIC__/layout/css/animate.css" rel="stylesheet">
<link href="__STATIC__/layout/css/style.css?v=4.1.0" rel="stylesheet">
<link href="__STATIC__/layout/css/channel.css?v=4.1.0" rel="stylesheet">
<!-- Sweet Alert -->
<link href="__STATIC__/layout/css/plugins/sweetalert/sweetalert.css" rel="stylesheet">


    <link rel="stylesheet" href="__STATIC__/layout/css/demo.css" type="text/css">
    <link href="__STATIC__/layout/css/gyq.css" rel="stylesheet">
</head>
<body class="white-bg" style="color:#333;padding:3px;">
<div class="padding-10">
<form action="" class="form-inline">
	<table class="table table-striped table-bordered table-hover bud_hei text-center" id="editable">
    <tr>
      <td colspan="6" class="text-left"><a href="javascript:;" class="btn-sm btn btn-info" id="addnew">新增</a><span class="lr_5"></span> <a href="javascript:;" class="btn btn-sm btn-danger" id="del_this">删除</a></td>
    </tr>
	<tr class="info">
            <td style="vertical-align: middle !important;text-align: center;width: 3%">
              <input type="checkbox" name="items" id="checkAll">
            </td>
            <td class="text-center">序号</td>
            <td class="text-center">操作类型</td>
            <td class="text-center">积分</td>
            <td class="text-center">一天最多积分</td>
            <td></td>
          </tr>
              <tr>
                   <td align="center"><input type="checkbox" name="items"></td>
                    <td>1</td>
                    <td>一天最多积分</td>
                    <td>10</td>
                    <td>100</td>
                    <td><a href="javascript:;" class="modify">修改</a></td>
              </tr>
              <tr>
                  <td align="center"><input type="checkbox" name="items"></td>
                    <td>2</td>
                    <td>登录系统</td>
                    <td>1</td>
                    <td>1</td>
                    <td><a href="javascript:;" class="modify">修改</a></td>
              </tr>
               <tr>
                  <td align="center"><input type="checkbox" name="items"></td>
                    <td>3</td>
                    <td>管理订单</td>
                    <td>2</td>
                    <td>10</td>
                    <td><a href="javascript:;" class="modify">修改</a></td>
              </tr>
              <tr>
                  <td align="center"><input type="checkbox" name="items"></td>
                    <td>4</td>
                    <td>管理库存</td>
                    <td>1</td>
                    <td>5</td>
                    <td><a href="javascript:;" class="modify">修改</a></td>
              </tr>
	</table>
</form>
    <h5 class="text-center"  style="font-size: 13px;font-weight: 500">
                    总共有12条记录，第1/2页,当前页<input id="page" type="text"  style="width: 40px" value="1"/><span id="gopage">Go</span>&nbsp;&nbsp;<span id="fistpage">首页</span>&nbsp;&nbsp;
                    每页显示
                    <select id="pagesize">
                        <option value='10' selected>10条</option>
                        <option value='15'>15条</option>
                        <option value='20'>20条</option>

                    </select>
                </h5>
    <!-- <h3 class="text-center"><img src="__STATIC__/layout/img/zwsj.png"></h3> -->
</div>
<script src="__STATIC__/layout/js/jquery.min.js"></script>
<script src="__STATIC__/layout/js/contabs_sub.js"></script>
<script src="__STATIC__/layout/js/bootstrap.min.js?v=3.3.6"></script>
<!-- Sweet alert -->
<script src="__STATIC__/layout/js/plugins/sweetalert/sweetalert.min.js"></script>
<script src="__STATIC__/layout/js/contabs_sub.js"></script>
<script src="__STATIC__/layout/js/plugins/layer/layer.min.js"></script>
  <script>
      
/*反选*/

          /*table表格操作*/
      $("#checkAll").click(function() {

            $("[name=items]:checkbox").prop("checked", $(this).prop("checked"));
            if ($("[name=items]:checkbox").prop("checked") != true) {
                // console.log($(this))
                $("[name=items]:checkbox").parents("tr").css("backgroundColor", "#fff")
            } else {
                $("[name=items]:checkbox").parents("tr").css("backgroundColor", "#f8f800")

            }
        })
        $("[name=items]:checkbox").click(function() {
            //定义一个临时变量，避免重复使用同一个选择器选择页面中的元素，提高程序效率
            // console.log(1)
            var $tmp = $("[name=items]:checkbox");
            if ($(this).prop("checked") != true) {
                // console.log($(this))
                $(this).parent().parent().css("backgroundColor", "#fff")
            } else {
                $(this).parent().parent().css("backgroundColor", "#f8f800")

            }
            //用filter()方法筛选出选中的复选框，并直接给CheckedAll赋值
            $("#checkAll").prop('checked', $tmp.length == $tmp.filter(':checked').length);

          })


/*新建*/
  $("#addnew").click(function(){
             layer.open({
                type: 1,
                title: '重设密码',
                 area: ['700px', '500px'],
                fixed: false, //不固定
                maxmin: true,
                content: '<div class="ibox-content"><form class="form-horizontal m-t" id="signupForm">  <div class="form-group">'+
                                '<label class="col-sm-3 control-label">操作<span class="colorRed">*</span>：</label>'+
                                '<div class="col-sm-8">'+
                                    '<select name="" id="" class="form-control">'+
                                      '<option value="0">一天做多积分</option>'+
                                      '<option value="1">登录系统</option>'+
                                      '<option value="2">下订单</option>'+
                                      '<option value="3">管理库存</option>'+
                                       '<option value="4">信息反馈</option>'+
                                    '</select>'+
                                '</div>'+
                           '</div>'+
                            '<div class="form-group">'+
                                '<label class="col-sm-3 control-label">积分<span class="colorRed">*</span>：</label>'+
                                '<div class="col-sm-8">'+
                                    '<input id="" name="" class="form-control" type="text">'+
                                '</div>'+
                            '</div>'+
                             '<div class="form-group">'+
                                '<label class="col-sm-3 control-label">一天最多积分<span class="colorRed">*</span>：</label>'+
                                '<div class="col-sm-8">'+
                                    '<input id="" name="" class="form-control" type="text">'+
                                '</div>'+
                            '</div>'+
                            '<div class="form-group"><div class="col-sm-4 col-sm-offset-3"><button class="btn btn-primary" type="submit">确定</button><span class="lr_5"></span><button class="btn btn-warning">取消</button></div></div></form></div>'
            });
            return false


          })
  /*修改*/
   $(".modify").click(function(){
             layer.open({
                type: 1,
                title: '重设密码',
                 area: ['700px', '500px'],
                fixed: false, //不固定
                maxmin: true,
                content: '<div class="ibox-content"><form class="form-horizontal m-t" id="signupForm">  <div class="form-group">'+
                                '<label class="col-sm-3 control-label">操作<span class="colorRed">*</span>：</label>'+
                                '<div class="col-sm-8">'+
                                    '<select name="" id="" class="form-control">'+
                                      '<option value="0">一天做多积分</option>'+
                                      '<option value="1">登录系统</option>'+
                                      '<option value="2">下订单</option>'+
                                      '<option value="3">管理库存</option>'+
                                      '<option value="4">信息反馈</option>'+
                                    '</select>'+
                                '</div>'+
                           '</div>'+
                            '<div class="form-group">'+
                                '<label class="col-sm-3 control-label">积分<span class="colorRed">*</span>：</label>'+
                                '<div class="col-sm-8">'+
                                    '<input id="" name="" class="form-control" type="text">'+
                                '</div>'+
                            '</div>'+
                             '<div class="form-group">'+
                                '<label class="col-sm-3 control-label">一天最多积分<span class="colorRed">*</span>：</label>'+
                                '<div class="col-sm-8">'+
                                    '<input id="" name="" class="form-control" type="text">'+
                                '</div>'+
                            '</div>'+
                            '<div class="form-group"><div class="col-sm-4 col-sm-offset-3"><button class="btn btn-primary" type="submit">确定</button><span class="lr_5"></span><button class="btn btn-warning">取消</button></div></div></form></div>'
            });
            return false


          });

   /*删除*/
   $("#del_this").click(function() {
            // $("#alert_addNewZone").show();
            var $items = $("[name=items]:checkbox")
            if ($items.filter(':checked').length < 1) {
                sweetAlert("", "请至少选择一条要删除的白名单！", "error");
            } else {
              $items.each(function(){ 
                if( $(this).is(':checked')){
                   $(this).parent().parent().remove();
                  }
        }); 
            }
        });

  </script>
</body>
</html>